<!DOCTYPE html>
<html>
<head>
	<div th:include="base-libs-easyui :: base-libs-easyui" />
<title>添加菜单</title>
	<style>
		#tableAction tbody tr.selected{
			background-color: #DFF0D8;
		}
	</style>
	<script th:inline="javascript">
        /**读取request中的初始化数据*/
        var actionTypes = [[${actionTypes}]];
        var yxpjOnline = [[${yxpjOnline}]];
	</script>
<script>

	/*当前功能列表编辑的行号*/
	var dgActionEditRowNumber = -1;

	$(function() {
		initView();
		initData();
	})

	/** 返回列表页面 */
	function toMenuIndex() {
		location = "index";
	}

	function initView() {
		$("#btnSave").on("click", btnSaveHandler);
		$("#btnBack").on("click", btnBackHandler);
		if(yxpjOnline){
            $("#btnQuery").on("click", btnQueryHandler);
            $("#btnQuery").show();
		}
        $("#btnAddAction").on("click", btnAddActionHandler);
        $("#btnDelAction").on("click", btnDelActionHandler);
        $("#btnAccpetACtion").on("click", accpet);

        /**不能删除或修改上级菜单编码*/
        $("#MENUID").on("keyup", function(evt){
            var currValue = $(this).val();
            var PRE_MENUID = $("#formMenu").data("menu")["PRE_MENUID"];
			if(currValue.indexOf(PRE_MENUID) != 0){
                $("#MENUID").val(PRE_MENUID);
			}
		})

		$("#dgAction").datagrid({
            fitColumns : true
			,toolbar: "#dgActionToolbar"
			,singleSelect: true
            ,columns:[[
				{
                    title : '功能名称',
                    field : 'ACTION_NAME',
                    width : '380'
					,editor: {
                    	type: "textbox"
						,options:{
                        	required:true
						}
                	}
				}
				,{
                    title : '功能类型',
                    field : 'ACTION_TYPE',
                    width : '280'
                    ,formatter: function(value,row){
                        var XMMC = "";
                        $.each(actionTypes, function(){
                            if(value == this["XMDM"]){
                                XMMC = this["XMMC"];
							}
						})
						return XMMC;
                    }
					,editor:{
                        type: "combobox"
                        ,options:{
                            valueField:'XMDM',
                            textField:'XMMC',
							data: actionTypes
							,panelHeight: 90
                            ,required:true
                        }
					}
                }
                ,{
                    title: '控件ID',
                    field : 'CONTROL_ID',
                    width : '300'
                    ,editor: {
                        type: "textbox"
                        ,options:{
                            required:true
                        }
                    }
                }
			]]
			,onClickRow: onClickRow
		});
	}
	
	function initData()
	{
		var menu = StoreCache.removeCache("cache_menu");
        $("#formMenu").data("menu", menu);
		/*新增 设置 菜单级别*/
		if(StringUtils.isEmpty(menu["MENUID"]))
		{
			var level = parseInt(menu["PRE_LEVEL"])+1;
			/*设置菜单编码最大长度*/
			var length = level*2;
			var config = $("#MENUID").attr("quick-config");
			config = config.split(",");
			config.push("length: '" + length + "-" + length + "'");
			$("#MENUID").attr("quick-config", config.join(","));
            $(".form-control").each(function(){
                var name = $(this).attr("name");
                var value = menu[name];
                $(this).QuickField("setData", value);
            })
            $("#MENUID").val(menu["PRE_MENUID"]);
            $("#MENU_LEVEL").val(level);
		}
		else
		{
			var menuId = menu["MENUID"];
			var level = parseInt(menu["MENU_LEVEL"]);
			$("#MENUID").val(menuId);
			$("#MENUID").attr("readonly", "readonly");
            $(".form-control").each(function(){
                var name = $(this).attr("name");
                var value = menu[name];
                $(this).QuickField("setData", value);
            })
            var actions = menu["ACTIONS"];
            setAtions(actions);
		}
	}
	
	/**保存回调*/
	function btnSaveHandler()
	{
		if($(".form-control[readonly!='readonly']").QuickValidate() && validActions())
		{
			var params = {"method": "add"};
			/*获取菜单功能*/
			var newActions = getAction();
			var menu = $("#formMenu").data("menu");
			if(!StringUtils.isEmpty(menu["MENUID"]))
			{
				params["method"] = "update";
				/*是否需要删除角色对应的菜单功能*/
				var deleteRoleMenuAction = geDeleteRoleMenuAction(menu["ACTIONS"], newActions);
                params["deleteRoleMenuAction"] = deleteRoleMenuAction;
			}
			/*数组转字符串*/
            params["actions"] = JSON.stringify(newActions);
			$.QuickRemote.AjaxFiledFormSubmit("formMenu", saveHandler, params, {deleteRoleMenuAction: deleteRoleMenuAction});
		}
	}
	function saveHandler(result, params)
	{
		var state = result["state"];
		if(state)
		{
			$.QuickAlert.alertNormal("保存成功", {callback: function(){
			    if(params["deleteRoleMenuAction"]){
                    $.QuickAlert.alertNormal("已经修改菜单功能，请重新配置角色对应菜单的功能", {callback: function() {
                        	$("#btnBack").trigger("click");
                    	}
                    });
				}
				else{
                    $("#btnBack").trigger("click");
				}
			}});
		}
		else
		{
			var info = result["info"];
			$.QuickAlert.alertFail({content: info["faultInfo"]});
		}
	}
	
	/**返回回调*/
	function btnBackHandler()
	{
		$.QuickUrlUtils.redirectUrl("index.html");
	}
	/**  查询已经配置的页面  */
	function btnQueryHandler(){
        $.QuickAlert.alertIFrame({
            type: 2,
            title: "选择运行评价页面",
            shade: 0.8,
            width:"90%",
            height:"500px",
            content:"/console/menu/queryFormList.html",
            end:function(){
                var bdid = StoreCache.getCache("yxpj_bdid");
                bdid = "/tjfx/yxpjpz/receiveYxpjView?BDID=" + bdid;
                $("#VIEWURL").val(bdid);
                StoreCache.removeCache("yxpj_bdid");
			}
		});
//        layer.full(index);
	}
	
	/**获取页面功能*/
	function getAction()
	{
		return $("#dgAction").datagrid("getRows");
	}

	function onClickRow(index){
        if (dgActionEditRowNumber != index){
            if (endEditing()){
                $('#dgAction').datagrid('selectRow', index)
                    .datagrid('beginEdit', index);
                dgActionEditRowNumber = index;
            } else {
                $('#dgAction').datagrid('selectRow', dgActionEditRowNumber);
            }
        }
	}

	function validActions(){
	    if(!endEditing()){
	        $.QuickAlert.alertFail({content: "请编辑菜单功能"});
	        return false;
		}else{
            return true;
		}
	}

	/**添加页面功能回调*/
	function btnAddActionHandler()
	{
		if(endEditing()){
            $("#dgAction").datagrid("appendRow", {
                ACTION_NAME: ""
				,ACTION_TYPE: ""
				,CONTROL_ID: ""
				,
			});
            dgActionEditRowNumber = $('#dgAction').datagrid('getRows').length-1;
            $('#dgAction').datagrid('selectRow', dgActionEditRowNumber).datagrid('beginEdit', dgActionEditRowNumber);
		}
	}

	/**完成编辑*/
	function accpet(){
        if (endEditing()){
            $('#dgAction').datagrid('acceptChanges');
        }
	}

	function endEditing(){
		if(dgActionEditRowNumber == -1){
		    return true;
		}
        if ($('#dgAction').datagrid('validateRow', dgActionEditRowNumber)){
            $('#dgAction').datagrid('endEdit', dgActionEditRowNumber);
            dgActionEditRowNumber = -1;
            return true;
		}
	}

	/**删除页面功能回调*/
	function btnDelActionHandler()
	{
        if (dgActionEditRowNumber == -1){return}
        $('#dgAction').datagrid('cancelEdit', dgActionEditRowNumber)
            .datagrid('deleteRow', dgActionEditRowNumber);
        dgActionEditRowNumber = -1;
	}

	/**设置菜单功能*/
	function setAtions(actions)
	{
	    if(actions){
            $('#dgAction').datagrid("loadData", actions);
		}
	}

	/**判断是否需要删除角色对应的菜单功能 主要判断原始的控件ID是否包含在新的列表里 只要有一个原始ID在新的列表里面没有 则需要删除角色对应的菜单功能*/
	function geDeleteRoleMenuAction(oldActions, newActions)
	{
	    var needDelete = true;
	    if(!oldActions || (oldActions.length == 0 && newActions.length == 0))
		{
            needDelete = false;
		}
		else
		{
		    $.each(oldActions, function(){
				var oldItem = this;
				var isExist = false;
				$.each(newActions, function(){
				    if(oldItem["ACTION_NAME"] == this["ACTION_NAME"]
						&& oldItem["ACTION_TYPE"] == this["ACTION_TYPE"]
						&& oldItem["CONTROL_ID"] == this["CONTROL_ID"]){
                        isExist = true;
                        return false;
					}
				})
                needDelete = !isExist;
				return isExist;
			})
		}
		return needDelete;
	}
</script>
</head>
<body class="easyui-layout">
	<div region="north" style="height: 41px; border: none; overflow: hidden; background-color: #f9f9f9;">
		<div class="title">
			<h3>菜单信息</h3>
		</div>
	</div>
	<div region="center" style="border: none;">
		<div class="easyui-layout" fit="true" style="border: none">
			<div region="north" style="height: 41px; padding-top: 6px;">
				<button id="btnBack" type="button" style=" margin-left: 10px;">返回</button>
				<button id="btnSave" type="button" style=" margin-left: 10px;">保存</button>
				<button id="btnQuery" type="button" style=" margin-left: 10px; display: none;">选择运行评价页面</button>
			</div>
			<div region="center" style="border: none">
				<form id="formMenu" action="save">
					<div class="easyui-panel" title="菜单基本信息">
						<table class="form-table">
							<tr>
								<td class="td-text">
									<label>上级菜单</label>
								</td>
								<td class="td-content">
									<input class="form-control" id="PRE_MENUNAME" name="PRE_MENUNAME" type="text"
										   readonly="readonly" placeholder="上级菜单"
										   quick-config="label:'上级菜单', validateProxy:'notNull length', length: '64'" />
									<input id="PRE_MENUID" name="PRE_MENUID" class="form-control" style="display: none;">
									<input id="MENU_LEVEL" name="MENU_LEVEL" class="form-control" style="display: none;">
								</td>
								<td class="td-text">
									<label>菜单编码</label>
								</td>
								<td class="td-content">
									<input id="MENUID" name="MENUID" type="text" placeholder="菜单编码"
										   class="form-control" quick-config="label:'菜单编码', validateProxy:'notNull length'" />
								</td>
							</tr>
							<tr>
								<td class="td-text">
									<label>菜单名称</label>
								</td>
								<td class="td-content">
									<input id="MENUNAME" name="MENUNAME" type="text" placeholder="菜单名称" class="form-control"
										   quick-config="label:'菜单名称', validateProxy:'notNull length', length: '50'" />
								</td>
								<td class="td-text">
									<label>显示顺序</label>
								</td>
								<td class="td-content">
									<input id="MENU_ORDER" name="MENU_ORDER" type="text" placeholder="显示顺序" class="form-control"
										   quick-config="label:'显示顺序', validateProxy:'notNull length', length: '2'" />
								</td>
							</tr>
							<tr>
								<td class="td-text">
									<label>视图路径</label>
								</td>
								<td class="td-content" colspan="3">
									<input id="VIEWURL" name="VIEWURL" type="text" placeholder="视图路径" class="form-control"
										   quick-config="label:'视图路径', validateProxy:'length', length: '100'" />
								</td>
							</tr>
							<tr>
								<td class="td-text">
									<label>备注</label>
								</td>
								<td class="td-content" colspan="3">
							<textarea id="NOTE" name="NOTE" type="text" placeholder="备注" class="form-control"
									  quick-config="label:'备注', validateProxy:'length', length: '500'" ></textarea>
								</td>
							</tr>
						</table>
					</div>
					<table id="dgAction" title="菜单功能"></table>
					<div id="dgActionToolbar" style="padding: 10px;">
						<button id="btnAddAction" type="button">添加</button>
						<button id="btnAccpetACtion" type="button">完成编辑</button>
						<button id="btnDelAction" type="button">删除</button>
					</div>
				</form>
			</div>
		</div>
	</div>
</body>
</html>
